@charset "UTF-8";
@import "~/scss/themes/index.scss";

$header-header: 60px;
$header-background-color: $base-color--white;

.web-header {
  -webkit-font-smoothing: antialiased;

  position: relative;
  z-index: 1000;
  margin: 0;
  padding: 0;

  padding: 0;
  background: $header-background-color;
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
  position: relative;
  .header-container {
    position: relative;
    background: #fff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
    .header-container__content {
      box-sizing: border-box;
      padding: 0 24px;
      line-height: 30px;
      position: relative;
      margin: 0 auto;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      height: $header-header;
    }
  }

  .nav-link {
    .nav-link-ul {
      height: $header-header;
      display: flex;
      align-items: center;
      .nav-link-item {
        display: inline-block;
        cursor: pointer;
        height: $header-header;
        line-height: $header-header;
        padding: 0 25px;
        color: $brand-primary;
        display: flex;
        align-items: center;
        .link {
          font-size: 14px;
          display: inline-block;
          white-space: nowrap;
          display: flex;
          color: $brand-primary;
          text-decoration: none;
        }
        &.link-item--hover:hover {
          background-color: $brand-primary;
          .link {
            color: #fff;
          }
        }
      }
    }
  }

  .nav-user-center {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    height: $header-header;
    .uc-item {
    }
  }

  .el-input__inner {
    width: 200px;
    height: 30px !important;
    line-height: 30px !important;
  }
  /*  .el-input__inner:focus{
    width:240px; */
  /* transform: scaleX(1.2); */
  /* transition:all 1s ease; */
  /* transition: 1s; */
  /* } */
  .el-input__suffix {
    top: -5px !important;
    color: #4d555d;
  }
  .el-popper[x-placement^="bottom"] {
    margin-top: 0px;
  }
  .el-autocomplete-suggestion li .img-right {
    margin-left: 14px;
  }
  .el-autocomplete-suggestion li .img-left {
    margin-right: 5px;
    line-height: 34px;
  }
  .el-autocomplete-suggestion li .name {
    display: flex;
    align-items: center;
  }
  .el-autocomplete-suggestion li:nth-of-type(1) {
    color: #999999;
  }
  .popper__arrow {
    display: none !important;
  }
}
